{{!
   Licensed to the Apache Software Foundation (ASF) under one
   or more contributor license agreements.  See the NOTICE file
   distributed with this work for additional information
   regarding copyright ownership.  The ASF licenses this file
   to you under the Apache License, Version 2.0 (the
   "License"); you may not use this file except in compliance
   with the License.  You may obtain a copy of the License at

       http://www.apache.org/licenses/LICENSE-2.0

   Unless required by applicable law or agreed to in writing, software
   distributed under the License is distributed on an "AS IS" BASIS,
   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
   See the License for the specific language governing permissions and
   limitations under the License.
}}

<div class="edit-script">
  <div {{bind-attr class=":panel :panel-editscript fullscreen:fullscreen content.isError:panel-danger:panel-default"}} >
    <div class="panel-heading">
      {{outlet nav}}

      {{!-- Button --}}
      {{#unless isExec}}
        <div {{bind-attr class=":btn-group :pull-right isRenaming:hide"}}>
          <button {{action "execute" content 'execute' }} type="button" class="btn btn-primary">{{t 'editor.execute'}}</button>

          <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
            <span class="caret"></span>
            <span class="sr-only">Toggle Dropdown</span>
          </button>
          <ul class="dropdown-menu" role="menu">
            <li><a href="#" {{action "execute" content 'explain' }} >{{t 'editor.explain'}}</a></li>
            <li><a href="#" {{action "execute" content 'syntax_check' }} >{{t 'editor.syntax_check'}}</a></li>
          </ul>
        </div>
        <div class="btn-group btn-group-xs pull-right tez-exec">
          <label class="btn btn-default" {{action 'toggleTez'}}>
            <i {{bind-attr class=":fa executeOnTez:fa-check-square-o:fa-square-o"}}></i> {{t 'editor.execute_on_tez'}}
          </label>
        </div>
        {{else}}
        <div class="spinner-sm pull-right"></div>
      {{/unless}}

      {{!-- Title --}}
      {{#unless isRenaming}}
        <div class="script-title">
          <h4> {{content.title}} <a href="#" {{action 'rename' 'ask'}} class="btn-rename"><i class="fa fa-pencil"></i></a></h4>
        </div>
      {{else}}
        <div  {{bind-attr class=":input-group :input-title titleWarn:has-error"}}>
          {{view view.focusInput
            id="title"
            placeholderTranslation="scripts.modal.script_title_placeholder"
            class="form-control"
            valueBinding="content.title"
            action='rename'
          }}
          <div class="input-group-btn">
            <button  type="button" {{action 'rename' 'cancel'}} {{bind-attr class=":btn :btn-default :btn-rename-cancel"}} >
              <i class="fa fa-lg fa-remove"></i> <span class="hidden-xs">{{t 'common.cancel'}}</span>
            </button>
          </div>
          <div class="input-group-btn">
            <button  type="button" {{action 'rename' content.title}} {{bind-attr class=":btn :btn-success :btn-rename-confirm content.isBlankTitle:disabled"}} >
              <i class="fa fa-lg fa-check"></i> <span class="hidden-xs">{{t 'editor.save'}}</span>
            </button>
          </div>
        </div>
      {{/unless}}

    </div>
    <div class="panel-body" >
      <div class="pull-left">
      {{pig-helper class="btn-group" editor=editor}}
        <div class="btn-group">
          <button type="button" data-toggle="dropdown" {{bind-attr class=":btn :btn-default :btn-xs :dropdown-toggle ufdsList.length::disabled"}} >
            {{t 'editor.udfhelper'}}
            <span class="caret"></span>
          </button>
          <ul class="dropdown-menu">
          {{#each ufdsList}}
            <li><a href="#" {{action 'insertUdf' this target="view" }}>{{this.name}}</a></li>
          {{/each}}
          </ul>
        </div>
      </div>
      <div class="fullscreen-toggle pull-right" {{action 'fullscreen'}} data-toggle="tooltip" data-placement="bottom"  {{translateAttr title="editor.toggle_fullscreen"}}><i {{bind-attr class=":fa :fa-lg fullscreen:fa-compress:fa-expand"}} ></i></div>
      <kbd class="file-path pull-right" data-toggle="tooltip" data-placement="bottom" {{translateAttr title="udfs.tooltips.path"}} >
        {{#unless content.pigScript.isLoaded}}
          <div class="spinner-sm"></div>
        {{else}}
          {{content.pigScript.id}}
        {{/unless}}
      </kbd>
    </div>
    <div class="editor-container">
      {{code-mirror id="pig_script" content=content.pigScript codeMirror=editor fullscreen=fullscreen}}
      <div class="ui-resizable-handle ui-resizable-s" id="sgrip"><i class="fa fa-ellipsis-h"></i></div>
    </div>
  </div>


  <div {{bind-attr class=":params-block pigParams::hidden"}}>
    <div class="block-title">
      <h4>{{t 'editor.params'}}</h4>
    </div>
    <div class="form-inline pigParams">
    {{#each pigParams}}
      <div class="form-group">
        <label class="control-label">{{this.title}}</label>
        <div class="">
         {{input class='form-control input-sm' valueBinding='value'}}
        </div>
      </div>
    {{/each}}
    </div>
  </div>

  <div class="arguments-block">
    <div class="block-title">
      <h4>{{t 'editor.arguments'}}</h4>
    </div>
    <div class="row">
      <div class="col-md-8 ">
        {{#if argumentsArray}}

        <div class="arguments-wrap">
          {{#each argumentsArray}}
            <span class="label label-primary"> <span class="pull-left" >{{this}}</span>  <a href="#" {{action "removeArgument" this}} {{bind-attr class=":close :rm-arg"}}><i class="fa fa-remove"></i></a> </span>
          {{/each}}
        </div>
        {{else}}
          <div class="alert alert-info" role="alert">
            {{t 'editor.no_arguments_message'}}
          </div>
        {{/if}}
      </div>
      <div class="col-md-4 ">
        <div class="input-group">
          {{input action="addArgument" placeholderTranslation="editor.pig_argument" class="form-control" valueBinding='tmpArgument'}}
          <span class="input-group-btn">
            <button class="btn btn-default pull-right" {{action 'addArgument' tmpArgument}} ><i class="fa fa-plus"></i> {{t 'common.add'}}</button>
          </span>
        </div>
      </div>

    </div>
  </div>

  {{outlet main}}

</div>
